.wgt-header-metis {
    height: 56px;
    width: 100%;
    background-color: #FFF;
    box-shadow: 0 2px 4px 0 rgba(0, 0, 0, .06);
    line-height: 56px
}

.wgt-header-metis > .h-m-container {
    position: relative;
    width: 1120px;
    height: 100%;
    margin: 0 auto
}

.wgt-header-metis > .h-m-container > .h-m-c-logo {
    display: block;
    position: absolute;
    top: 50%;
    margin-top: -14px;
    left: 0;
    background-repeat: no-repeat;
    background-image: url(https://iknowpc.bdimg.com/static/common/widget/header-metis/img/logo.ddd2a19.png);
    width: 157px;
    height: 28px;
    background-size: contain
}

.wgt-header-metis > .h-m-container > .h-m-c-status {
    height: 100%;
    position: absolute;
    left: 193px;
    top: 50%;
    margin-top: -12px;
    line-height: 24px
}

.wgt-header-metis > .h-m-container > .h-m-c-status > .h-m-c-s-desc {
    text-align: center;
    font-size: 14px;
    display: inline-block;
    height: 22px;
    line-height: 22px;
    border-radius: 4px;
    padding: 0 4px;
    border: 1px solid #FFAC0F;
    color: #FFAC0F
}

.wgt-header-metis > .h-m-container > .h-m-c-status > .h-m-c-s-desc.red {
    color: #EE5E0F;
    border-color: #EE5E0F
}

.wgt-header-metis > .h-m-container > .h-m-c-status > .h-m-c-s-link {
    display: inline-block;
    margin-left: 10px;
    font-size: 14px;
    color: #333;
    text-decoration: none;
    outline: 0
}

.wgt-header-metis > .h-m-container > .h-m-c-status > .h-m-c-s-link:hover {
    text-decoration: underline
}

.wgt-header-metis > .h-m-container > .h-m-c-status > .h-m-c-p-icon {
    display: inline-block;
    width: 20px;
    height: 20px;
    background: url(https://iknowpc.bdimg.com/static/common/widget/header-metis/img/notice.45471c2.svg) no-repeat;
    vertical-align: middle;
    margin-right: 10px
}

.wgt-header-metis > .h-m-container > .h-m-c-status > .h-m-c-p-desc {
    color: #34B458
}

.wgt-header-metis > .h-m-container > .h-m-c-status.h-m-c-pass {
    display: none
}

.wgt-header-metis > .h-m-container > .h-m-c-userbar {
    position: absolute;
    height: 100%;
    top: 0;
    right: 0
}

.wgt-header-metis > .h-m-container > .h-m-c-userbar > .u-icon-links {
    position: relative;
    float: right;
    display: block;
    height: 100%;
    width: 200px;
    margin-right: 15px
}

.wgt-header-metis > .h-m-container > .h-m-c-userbar > .u-icon-links:after {
    position: absolute;
    content: "";
    top: 50%;
    margin-top: -10px;
    right: 0;
    display: block;
    height: 20px;
    width: 1px;
    background-color: #E8ECEE
}

.wgt-header-metis > .h-m-container > .h-m-c-userbar > .u-icon-links > .u-icon-link {
    position: absolute;
    top: 50%;
    margin-top: -11px;
    display: inline-block;
    width: 22px;
    height: 22px;
    background-repeat: no-repeat;
    background-position: center
}

.wgt-header-metis > .h-m-container > .h-m-c-userbar > .u-icon-links > .u-icon-link > .u-i-l-redpoint {
    display: none;
    position: absolute;
    width: 6px;
    height: 6px;
    border-radius: 3px;
    background-color: red;
    top: 0;
    right: 0;
    z-index: 1
}

.wgt-header-metis > .h-m-container > .h-m-c-userbar > .u-icon-links > .u-icon-link > .u-i-l-redpoint.show {
    display: block
}

.wgt-header-metis > .h-m-container > .h-m-c-userbar > .u-icon-links > .u-icon-link.u-icon-letter {
    right: 16px
}

.wgt-header-metis > .h-m-container > .h-m-c-userbar > .u-icon-links > .u-icon-link.u-icon-msg {
    right: 58px
}

.wgt-header-metis > .h-m-container > .h-m-c-userbar > .u-icon-links > .u-icon-link > .iknow-icons {
    position: absolute;
    top: 0;
    left: 0;
    font-size: 21px;
    color: #333
}

.wgt-header-metis > .h-m-container > .h-m-c-userbar > .u-operation-btn {
    position: absolute;
    top: 0;
    right: 0;
    width: 32px
}

.wgt-header-metis > .h-m-container > .h-m-c-userbar > .u-operation-btn:hover {
    width: 120px;
    height: 94px
}

.wgt-header-metis > .h-m-container > .h-m-c-userbar > .u-operation-btn:hover > .u-o-b-btns {
    display: block;
    transition: all .2s linear
}

.wgt-header-metis > .h-m-container > .h-m-c-userbar > .u-operation-btn:hover > .iknow-icons {
    transform: scale(0.5) rotate(180deg)
}

.wgt-header-metis > .h-m-container > .h-m-c-userbar > .u-operation-btn > .iknow-icons {
    position: absolute;
    right: -8px;
    width: 32px;
    height: 18px;
    font-size: 18px;
    transform: scale(0.5);
    color: #CFD7DC;
    top: 28px;
    margin-top: -6px;
    cursor: pointer
}

.wgt-header-metis > .h-m-container > .h-m-c-userbar > .u-operation-btn > .u-o-b-btns {
    display: none;
    z-index: 9999;
    transition: all .2s linear;
    position: absolute;
    right: 0;
    width: 120px;
    top: 50px;
    background-color: #fff;
    border: 1px solid #DAE0E4;
    box-shadow: 0 2px 7px 0 rgba(0, 0, 0, .1);
    border-radius: 4px;
    overflow: hidden;
    font-size: 14px;
    color: #000
}

.wgt-header-metis > .h-m-container > .h-m-c-userbar > .u-operation-btn > .u-o-b-btns > .u-operation-btn {
    height: 40px;
    width: 100%;
    line-height: 40px;
    text-align: center;
    cursor: pointer;
    transition: all .2s linear;
    display: block;
    text-decoration: none;
    color: #000;
    background-color: #fff
}

.wgt-header-metis > .h-m-container > .h-m-c-userbar > .u-operation-btn > .u-o-b-btns > .u-operation-btn:hover {
    background-color: #F5F8F8
}

.wgt-header-metis > .h-m-container > .h-m-c-userbar > .u-operation-btn > .u-o-b-btns:hover {
    transition: all .2s linear;
    display: block
}

.wgt-header-metis > .h-m-container > .h-m-c-userbar > .u-operation-btn > .u-o-b-btns:before {
    position: absolute;
    display: block;
    content: "";
    top: -20px;
    right: 0;
    width: 100%;
    height: 20px
}

.wgt-header-metis > .h-m-container > .h-m-c-userbar > .u-avatar {
    float: right;
    position: relative;
    top: 50%;
    margin-top: -16px;
    border-radius: 16px;
    margin-right: 10px;
    overflow: hidden
}

.wgt-header-metis > .h-m-container > .h-m-c-userbar > .u-username {
    float: right;
    height: 100%;
    font-size: 16px;
    color: #333;
    margin-right: 14px
}

.wgt-header-metis > .h-m-container > .h-m-c-userbar > .u-username.right {
    margin-right: 25px
}

.wgt-header-metis > .h-m-container > .h-m-c-userbar > .u-usertype {
    float: right;
    margin-top: 18px;
    margin-right: 29px;
    line-height: 22px;
    height: 22px;
    text-align: center;
    font-size: 14px;
    display: block;
    border-radius: 4px;
    padding: 0 4px;
    border: 1px solid #4ACA6D;
    color: #34B458
}

div.unpass-reason-dialog div.ui-dialog-content {
    margin-top: 0;
    padding: 30px 16px 0
}

div.unpass-reason-dialog div.ui-dialog-content .scroll-content {
    height: 206px;
    padding: 0 24px
}

div.unpass-reason-dialog div.ui-dialog-content .scroll-content .reason-title {
    margin-bottom: 30px;
    line-height: 20px;
    font-size: 20px
}

div.unpass-reason-dialog div.ui-dialog-content .scroll-content .reason-ul .reason-item {
    text-align: left;
    font-size: 16px;
    color: #323232;
    letter-spacing: 0;
    line-height: 24px;
    margin-bottom: 12px
}